<template>
  <scrollbar :itemList="materialList" :colorStyle="colorStyle" @click="scrollbarItemClick" v-if="materialList.length > 1"></scrollbar>
</template>

<script>
let api = require('../include/api')
// let modal = weex.requireModule('modal')
module.exports = {
  components: {
    'scrollbar': require('./scrollbar.vue')
  },
  props: {
    colorStyle: {default: 'default'},
    catId: {default: ''}
  },
  data () {
    return {
      materialList: []
    }
  },
  created () {
    // modal.alert({message: this.catId})
    api.taobaoMaterial.list({catId: this.catId}).done((rs) => {
      rs.data.forEach(t => {
        t.title = t.name
      })
      this.materialList = rs.data
    })
  },
  methods: {
    scrollbarItemClick (idx) {
      let material = this.materialList[idx]
      this.$emit('materialSelected', material)
    }
  }
}
</script>

<style lang="scss">

</style>
